<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>PetStore Management</title>
    <link rel="Stylesheet" href="../css/backjpetstore.css" type="text/css" media="screen"/>
    <link rel="stylesheet" href="../css/register.css" type="text/css" media="screen">
</head>
<style>
    #Header{
        width: 80ex;
        height: 50ex;
        background-color: #ffffff;
        margin-top: 10ex;
        margin-left: 30%;
        position: relative;
        border-color: #56832c;
        border-width: 1ex;
        border-style: solid;
    }
    #code{
        width: 50ex;
        height:5ex;
        border-color: #56832c;
        border-width: 1ex;
        border-style: solid;
        position: absolute;
        top: 20ex;
        left: 15ex;
    }
    .EnterButton{
        background-image: url("../image/Enter_Button.png");
        background-repeat: no-repeat;
        width: 23ex;
        height: 9ex;
        background-size: 100%;
        background-color: #ffffff;
        position: absolute;
        left: 29ex;
        top: 35ex;
        border-color: #56832c;
        border-width: 1ex;
        border-style: solid;
    }
</style>
<body>
<div id="Header">
    <img style="width: 90%;margin-left: 5%;margin-top: 3%" src="../image/PleaseEnterPassword.png">
    <input type="password" id="code" >
    <input class="EnterButton" type="button" value="" th:onclick="judge()">
    <span id="codeTips"></span>
    <script th:src="@{../js/jquery-3.5.1.min.js}"></script>
    <script>
        // 判断密码是否正确
        function judge(){
            if(document.getElementById("code").value === "1"){
                location.href = "/manage/main";
            }else{
                $('#codeTips').attr("class","invalid").text("密码错误！");
            }
        }
    </script>
</div>
</body>
</html>